<template>
	<view style="background-color: #efefef; width: 100vw;height: 100vh;overflow: hidden;">

		<view style="width: 90vw;margin: 20px auto;background-color: #fff; padding: 20rpx;border-radius: 12rpx;">
			<view style="display: flex;">
				<view style="font-weight: 700;">经办人信息:</view>
				<view style="margin-left: 20rpx;">{{jsydata.operName}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">收款人信息:</view>
				<view style="margin-left: 20rpx;">{{jsydata.reimUser}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">车牌号:</view>
				<view style="margin-left: 20rpx;">{{jsydata.plateNum}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">车辆公里数:</view>
				<view style="margin-left: 20rpx;">{{jsydata.currentKilo?jsydata.currentKilo:''}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">业务部门:</view>
				<view style="margin-left: 20rpx;">{{jsydata.deptName}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;width: 240rpx;">报账详情:</view>
				<view style="margin-left: 20rpx;">{{jsydata.remark}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">凭证图片:</view>
				<view style="margin-left: 20rpx;">
					<u-image width="300rpx" height="300rpx"
						:src="'https://cba360.com/'+jsydata.reimVoucherUrl"></u-image>
				</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">支出金额:</view>
				<view style="margin-left: 20rpx;">{{jsydata.reimMoney}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">支出金额详情:</view>
				<view style="margin-left: 20rpx;">{{jsydata.reimMoneyDetail}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">记账审核状态:</view>
				<view style="margin-left: 20rpx;">
					{{jsydata.isCheck == 'NO_CHECK'?'未审核':jsydata.isCheck == 'CHECKED'?'已审核':jsydata.isCheck == 'CANCELLATION'?'已报销':'未通过'}}
				</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">驳回原因:</view>
				<view style="margin-left: 20rpx;">{{jsydata.refuseReason?jsydata.refuseReason:''}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">报账类型:</view>
				<view style="margin-left: 20rpx;">{{jsydata.moneyTypeName}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">支付日期:</view>
				<view style="margin-left: 20rpx;">{{jsydata.payTime?jsydata.payTime:''}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">费用产生日期:</view>
				<view style="margin-left: 20rpx;">{{jsydata.costStartTime?jsydata.costStartTime:''}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">费用结束日期:</view>
				<view style="margin-left: 20rpx;">{{jsydata.costEndTime?jsydata.costEndTime:''}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">入账月份:</view>
				<view style="margin-left: 20rpx;">{{jsydata.enterTime?jsydata.enterTime:''}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">添加时间:</view>
				<view style="margin-left: 20rpx;">{{jsydata.addTime}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">操作标识:</view>
				<view style="margin-left: 20rpx;">{{jsydata.operMark?jsydata.operMark:''}}</view>
			</view>
			<view style="display: flex;">
				<view style="font-weight: 700;">操作备注:</view>
				<view style="margin-left: 20rpx;">{{jsydata.operNote?jsydata.operNote:''}}</view>
			</view>
			<view  v-if='jsydata.isCheck == "NO_CHECK"'  style="margin-top: 40rpx;margin-bottom: 30rpx;display: flex;justify-content:space-evenly;">
				<u-button style="width: 30vw;" @click="recognition_Btn2" type="warning">审核不通过</u-button>
				<u-button style="width: 30vw;" @click="recognition_Btn" type="primary">审核通过</u-button>

			</view>
		</view>

		<u-modal :title="delMd.tip" :confirm-style="{'color': '#00c3ce'}" v-model="delMd.state"
			:show-cancel-button="true" @confirm="okDelQj">
			<!-- <view class="c-yellow" :style="{'padding': '20rpx', 'text-align': 'center'}">{{delMd.tip}}</view> -->
			<view style="width: 560rpx;margin: auto;">
				<u-input :border="true" v-model="ps.remark" :type="'textarea'" :custom-style="{'color': '#00C3CE'}"
					:placeholderStyle="'color: #f000000;'" :clearable="false" :auto-height="true" :height="150"
					:placeholder="'备注'" />
			</view>
		</u-modal>
	</view>
</template>

<script>
	export default {

		data() {
			return {
				jsydata: {},
				// 删除--弹框
				delMd: {
					state: false,
					title: '删除提示',
					tip: '', // 提示内容
					obj: null, // 参数对象
				},
				ps: {
					ids: [],
					isCheck: '',
					remark: '',
				},
			}
		},
		onLoad(e) {

		},
		// 在 App.vue 中设置页面切换监听
		onShow() {

		},
		mounted() {
			this.jsydata = uni.getStorageSync('jsydata');
			console.log(this.jsydata)
		},
		methods: {
			recognition_Btn2(e) {
				let that = this,
					U = that.U;
				that.ps.ids = [that.jsydata.id]
				that.ps.isCheck = 'REFUSED'
				that.ps.remark = ''

				that.delMd = {
					state: true,
					title: '审核',
					tip: '确定审核不通过吗？',
					obj: ''
				};
			},
			recognition_Btn(e) {
				let that = this,
					U = that.U;
				that.ps.ids = [that.jsydata.id]
				that.ps.isCheck = 'CHECKED'
				that.ps.remark = ''
				that.delMd = {
					state: true,
					title: '审核',
					tip: '确定审核通过吗？',
					obj: ''
				};
			},
			// 确认删除-
			okDelQj() {
				let that = this,
					U = that.U,
					id = that.delMd.obj;

				that.$u.api.checkStaffReimburse(that.ps).then(res => {
					if (res.code == 1) {
						U.qsuccess(res.msg, 3000, function() {
							// 隐藏弹框
							that.delMd.state = false;

							// 调用父级onLoad中的刷新方法
							uni.$emit('refQjList');
							// 返回上一页
							uni.navigateBack({
								delta: 1
							});
						});
					} else {
						U.qerror(res.msg);
					}
				});
			},

		},



	}
</script>

<style lang="less">
	.lt-btns {
		display: flex !important;
	}

	.qj-list {
		min-height: 100vh;
		padding-top: 2rpx;
	}

	.routeSimpleName {
		position: absolute;
		left: 380rpx;
		width: 200rpx;
		background: #fff;
		top: 10rpx;
		z-index: 9999;
		text-align: center;
		border-radius: 10rpx;
		border: 1px solid #00C3CE;
		color: #00C3CE;
		margin-right: 10rpx;
		display: flex;
		height: 40rpx;
		justify-content: space-between;

	}
</style>